<template>
  <div class="see_spot">
    <el-dialog
      title="景区详情"
      :visible.sync="isShowDia"
      width="70%"
      :before-close="handleClose"
    >
      <el-form :model="seeDiaInfo" label-width="80px">
        <!-- <el-col :span="12"></el-col> -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="景区名称:">
              {{ seeDiaInfo.jingquName ? seeDiaInfo.jingquName : "--" }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地址:">
              {{ seeDiaInfo.jingquName ? seeDiaInfo.jingquName : "--" }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="位置经度:">
              {{ seeDiaInfo.lon ? seeDiaInfo.lon : "--" }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="位置纬度:">
              {{ seeDiaInfo.lat ? seeDiaInfo.lat : "--" }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="开园时间:">
              {{ seeDiaInfo.jingquOpenTime }}~{{ seeDiaInfo.jingquCloseTime }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="标签:">
              {{ seeDiaInfo.jingquTips ? seeDiaInfo.jingquTips : "--" }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="景区图片:">
              <el-image
                style="width: 100px; height: 100px"
                :src="seeDiaInfo.jingquPictureUrl"
                :preview-src-list="[seeDiaInfo.jingquPictureUrl]"
              >
              </el-image>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状态:">
              {{ seeDiaInfo.jingquStatus == 0 ? "开放" : "关闭" }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="景区介绍:">
              <p v-html="seeDiaInfo.jingquText"></p>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    isShowDia: {
      type: Boolean,
      default: () => false,
    },
    seeDiaInfo: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {};
  },
  created() {},
  computed: {
    jingquId() {
      return this.seeDiaInfo.jingquId;
    },
  },

  methods: {
    handleClose() {
      this.$emit("closeSeeDia");
    },
    getFileType(filePath) {
      const linkParts = filePath.split(".");
      if (linkParts.length > 1) {
        return linkParts[linkParts.length - 1];
      } else {
        return "Unknown";
      }
    },
  },
};
</script>
<style lang="scss" scoped></style>
